<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags"%>

<div class="bespeak">
      <h1>预约设计</h1>
      <div class="blank10"></div>
      <input type="text" value="姓名" id="name" onfocus="if(value=='姓名') {value=''}" onblur="if (value=='') {value='姓名'}" class="text">
      <input type="text" value="手机号" id="mobile" onfocus="if(value=='手机号') {value=''}" onblur="if (value=='') {value='手机号'}" class="text">
      <select name="" class="select" id="provinceId">
         <option value="湖南省">湖南省</option>
         <option value="广州省">广州省</option>
      </select>
      <select name="" class="select" id="cityId">
         <option value="长沙市">长沙市</option>
         <option value="岳阳市">岳阳市</option>
      </select>
      <select name="" class="select1" id="communityId">
         <option value="恒大名都">恒大名都</option>
         <option value="中南一号院">中南一号院</option>
      </select>
      <input name="" type="button" class="button" value="一键预约" onclick="order2();">
    </div>
    
    
    <script>
    	$(function() {
    		// 一键预约
    	    function order2() {
    	    	//window.yysj("<iframe src='/model/yysj.html' width='100%' height='175px' frameborder='0' scrolling='no'></iframe>"); 
    	    	$.ajax({
    	    		url: "${ctx}/designer/orderDesigner",
    	    		data: {
    	    			name: $('#name').val(),
    	    			mobile: $('#mobile').val(),
    	    			provinceId: $('#provinceId').val(),
    	    			cityId: $('#cityId').val(),
    	    			communityId: $('#communityId').val(),
    	    			from: $('#from').val()
    	    		},
    	    		dataType: "json",
    	    		type: "post",
    	    		success: function(data) {
    	    			if (data.success) {
    	    				layer.msg('预约成功，请耐心等待!',{time: 1000, icon:6,shade: [0.5, '#f5f5f5']});
    	    			} else {
    	    				layer.alert(data.msg,{icon:2,skin: 'layer-ext-moon'});
    	    			}
    	    		}
    	    		
    	    	});	
    	    }
    		
    		
    	    $('#provinceId').change(function() {
    	    	$.ajax({
    	    		url: "${ctx}/province/findArea",
    	    		data: {
    	    			provinceId: $('#provinceId').val()
    	    		},
    	    		dataType: "json",
    	    		success: function(data) {
    	    			$('#cityId').html('');
    	    			$('#cityId').append('<option value="">城市</option>');
    					for (var i = 0; i < data.length; i++) {
    						var obj = data[i];
    						var option = '<option value="' + obj.id + '">' + obj.name + '</option>';
    						$('#cityId').append(option);	
    					}
    	    		}
    	    		
    	    	});
    	    });
    	    
    	    $('#cityId').change(function() {
    	    	$.ajax({
    	    		url: "${ctx}/design/findCommunityByCity",
    	    		data: {
    	    			cityId: $('#cityId').val()
    	    		},
    	    		dataType: "json",
    	    		success: function(data) {
    	    			$('#communityId').html('');
    	    			$('#communityId').append('<option value="">楼盘</option>');
    					for (var i = 0; i < data.length; i++) {
    						var obj = data[i];
    						var option = '<option value="' + obj.id + '">' + obj.name + '</option>';
    						$('#communityId').append(option);	
    					}
    	    		}
    	    		
    	    	});	
    	    });
    	});
    </script>